<!DOCTYPE html>
<html>
<head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<% include nav %>
<div class="form">
    <form name="update">
    	<input type="hidden" class="update-name" name="username" value=""/>
        <div class="hori clearfix">
            <div class="hori-name span3"><label for="">密码：</label></div>
            <div class="hori-input span7"><input type="password" name="userpass" /></div>
        </div>
        <div class="hori" style="position:relative;">
            <input class="submit-input" type="button" value="确认修改">
            <div class="write-info" style="position:absolute;top:4px;font-size:12px;color:#333;display:none;color:orange;">亲，你的密码不可以不填哦~</div>  
        </div>
    </form> 
</div>
<div class="mask hide">
    <div class="mask-info">
        您的在线阅读账号的密码已经修改！
    </div>
</div>
<% include footer %>
<script src="/js/require.js"></script>
<script>
    require.config({
        paths: {
            'jquery': '/js/jquery-2.1.3.min',
            'remind':'/js/remind'
        }
    });

    require(['remind','jquery'], function(Remind,$) {
        //未填写密码的给予提醒
        var wai = $(".form"),
            innerbtn = $(".submit-input");
        Remind.remind(wai,innerbtn);

        var updateName = localStorage.getItem("username");
        $(".form .update-name").attr("value",updateName);

        //点击修改
        $(".submit-input").click(function(){
            var pass = $("input[type='password']").val();
            if(pass!=''){
                localStorage.setItem("userpass",pass);
                $(".mask").fadeIn(500)
                setTimeout(function(){
                    $(".mask").fadeOut(500);
                    setTimeout(function(){
                        document.update.submit();
                    },1000)
                },1500)
            }
        });
    })
</script>
</body>
</html>